import {
    _decorator,
    Component,
    Label,
    Layout,
    Node,
    ScrollView,
    Size,
    sys,
    UITransform,
    v3,
} from 'cc';

import { GroupData } from './GUIGroup';

const { ccclass, property } = _decorator;

@ccclass('GUIWindow')
export class GUIWindow extends Component {
    @property(ScrollView)
    protected scrollView: ScrollView = null;

    @property(GroupData)
    groupData: GroupData = new GroupData();

    @property(Label)
    label: Label = null!;

    @property
    defaultFold = false;

    // 最大高度
    getMaxHeight() {
        const safeArea = sys.getSafeAreaRect();
        return safeArea.height - 30;
    }

    onLoad(): void {
        this.groupData.setFold(this.defaultFold);
    }

    onClickArrow() {
        this.groupData.changeFold();
    }

    init(name: string, size: Size) {
        this.label.string = name;
        const trans = this.node.getComponent(UITransform);
        const scrollTrans = this.scrollView.getComponent(UITransform);
        scrollTrans.setContentSize(
            new Size(
                size.width,
                Math.min(size.height, this.getMaxHeight()),
            ),
        );
        this.node.position = v3(
            sys.getSafeAreaRect().xMax / 2 - trans.width / 2,
            this.node.position.y,
            0,
        );
    }

    addContent(ui: Node) {
        this.groupData.addContent(ui);
    }
}
